.container{
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    .type{
        position: absolute;
        top: 40px;
        left: 0;
        right: 0;
        margin: auto;
        z-index: 1111;
        text-align: center;
        width: 150px;
        background-color: #1677ff;  
        height: 30px;
        line-height: 30px;
        border-radius: 15px;
        font-weight: bold;      
    }

    .mapContainer{
        width: 100%;
        height: 100%;
    }
    // .header {
    //     display: flex;
    //     height: 45px;
    //     position: relative;
    //     width: 100%;
    //     .title{
    //         font-size: 24px;
    //         position: absolute;
    //         top: 0;
    //         right: 0;
    //         bottom: 0;
    //         left: 0;
    //         margin: auto;
    //         display: inline-table;
    //     }
    // }
    // .cardPanel{
    //     display: flex;
    //     justify-content: space-between;
    //     .desc{
    //         display: flex;
    //         flex-direction: column;
    //         label{
    //             font-size: 20px
    //         }
    //         span{
    //             color: #aaa;
    //         }
    //     }
    //     .remain{
    //         b{
    //             font-size: 24px;
    //             font-family: math;
    //             color: #c2b04d;
    //         }
    //     }
    // }
    // .benefitsPanel{
    //     display: flex;
    //     justify-content: space-between;
    //     flex-wrap: wrap;
    //     .item{
    //         display: flex;
    //         flex-direction: column;
    //         justify-content: center;
    //         align-items: center;
    //     }
    // }
    // .costPanel{
    //     display: flex;
    //     justify-content: space-between;
    //     .item{
    //         width: 100px;
    //         height: 100px;
    //         border: 1px solid #aaa;
    //         display: flex;
    //         flex-direction: column;
    //         justify-content: center;
    //         align-items: center;

    //         label{
    //             color: #aaa;
    //             font-weight: bold;
    //         }
    //         span{
    //             color: #ddd;
    //             font-size: 20px;
    //         }
    //         &.active{
    //             border: 1px solid #4e4307;
    //             background-color: #4e4307;
    //         }
            
    //     }
    // }
    
}

// .joinvip{
//     height: 100px;
//     background-image: url('./img/joinvip.png');
//     background-repeat: no-repeat;
//     background-size: 100% 100%;
//     display: flex;
//     justify-content: space-evenly;
//     line-height: 54px;
//     color: #c2b04d;
//     font-size: 32px;
// }

:global {

    body {
        background-color: #242424;
        color: #ddd;
        // background: linear-gradient(to right, #000000,#00000000 30%,#00000000 70%, #000000);
    }

    .ant-card{
        background-color: #373737;
    }

    .ant-card-head-title, .ant-card-body{
        color: #ddd;
    }
    
}